<table class="list">
  <tr>
    <th class="userlistheader" align="right">all sites
  <tr>
    <td>
    <div class="userlist">{% for site in sites %}
    <div class="siteitem" style="background-color: {{site.color|escape}}">
    <div class="siteitemtitle"><a href="/a/{{site.path}}">{{site.display_name|escape}}</a></div>    
    <div class="siteitemlogo"><a title="{{site.description|escape}}" href="/a/{{site.path}}">    
    <img title="{{site.description|escape}}" src="/getimg/{{site.path}}.{{site.logotype}}"></a></div>
    <div class="siteitemstats">users:{{site.usercount}} vids:{{site.videocount}}</div>
    </div>
    {% endfor %}</div>
</table>
{% if previousurl %}
<div class='navlink'><a href="{{ previousurl|escape }}">previous</a></div>
{% endif %}
<div class='navlink'><a href="{{ nexturl|escape }}">next</a></div><br>
{% if user %}
<p>
<table class="list">
  <tr>
    <th class="userlistheader" align="right">sites you've made | <a href="/#edit">create one</a>
  <tr>
    <td>
    <div class="userlist">{% for site in usersites %}
    <div class="siteitem" style="background-color: {{site.color}}">
    <div class="siteitemtitle"><a href="/a/{{site.path}}">{{site.display_name|escape}}</a></div>    
    <div class="siteitemlogo"><a title="{{site.description|escape}}" href="/a/{{site.path}}">
    <img title="{{site.description|escape}}" src="/getimg/{{site.path}}.{{site.logotype}}"></a></div>
    <div class="siteitemedit"><a href="/?edit={{site.path}}#edit">edit this site</a></div>
    </div>
    {% endfor %}</div>
</table>
<p>
<form class="metadata" action="/" method="POST" enctype="multipart/form-data">
<table class="metadata">
  <tr>
    <th class="label" colspan="2">{% if edit %}<a name="edit">edit this site</a>{% else %}<a name="edit">create a site</a>{% endif %}
  <tr>
    <td class="label">title:
    <td class="field"><input name="display_name" value="{{site.display_name|escape}}" class='siteinput' />
  <tr>
    <td class="label">path (alphanum):
    <td class="field"><input name="path" value="{{site.path|escape}}" class='siteinput' />
  <tr>
    <td class="label">description:
    <td class="field"><textarea class='siteinput' name="description">{{site.description|escape}}</textarea>
  <tr>
    <td class="label">base YouTube query:
    <td class="field"><input name="base_query" value="{{site.base_query|escape}}" class='siteinput' />
  <tr>
    <td class="label">color (any css val):
    <td class="field"><input name="color" value="{{site.color|escape}}" class='siteinput' /> 
  {% if site.logo %}
  <tr>
    <td class="label">current logo:
    <td class="field"><img title="{{site.description|escape}}" src="/getimg/{{site.path}}.{{site.logotype}}">
  {% endif %}
  <tr>
    <td class="label">logo:<br>(155x85 ideal)<br>less than 200k
    <td class="field"><input type="file" name="logo" class='siteinput' />
  <tr>
    <td>
    <td align="right">
    <button type="submit">Submit</button>
    <input type="hidden" name="edit" value="{% if edit %}{{site.key}}{% endif %}"/>
</table>
</form>
{% else %}
<p> please login to create your own site!
<p>
{% endif %}
<a href="/about">about instantvidsite</a>
</body>
</html>